import { getUUID, deepClone } from '@/utils'
import { cloneDeep } from 'lodash'

const defaultStyle = {
  position: 'absolute',
  width: 300,
  height: 150,
  top: 200,
  left: 0,
  rotate: 0,
  paddingTop: 0,
  paddingLeft: 0,
  paddingRight: 0,
  paddingBottom: 0,
  marginTop: 0,
  marginLeft: 0,
  marginRight: 0,
  marginBottom: 0,
  borderWidth: 0,
  borderColor: '',
  borderStyle: 'solid',
  borderRadius: 0,
  boxShadow: '',
  fontSize: 16,
  fontWeight: 500,
  lineHeight: 1.4,
  letterSpacing: 0,
  textAlign: 'center',
  color: '#000000',
  fontFamily: 'Microsoft YaHei',
  backgroundColor: '',
  backgroundImage: '',
  backgroundSize: 'cover',
  opacity: 1,
  zIndex: 1
}
const defaultDict = {
  'String': '',
  'Array': [],
  'Object': {},
  'Boolean': false,
  'Number': 0
  // 待扩展数据类型
}

export class ElementModel {
  uuid = '';
  elName = '';            // 组件名
  title = '';         // 组件别名
  value = ''              // 绑定值
  valueType = 'String';   // 值类型
  animations = [];        // 动画
  events = [];
  commonStyle = {};
  propsValue = {};        // 属性参数

  constructor(elemData, extendStyle = {}) {
    this.uuid = elemData.uuid || getUUID()
    const type = elemData.valueType || 'String'
    this.elName = elemData.elName
    this.value = elemData.value || elemData.defaultValue || defaultDict[type]
    this.valueType = type
    this.commonStyle = { ...defaultStyle, ...elemData.defaultStyle, ...extendStyle }
    this.animations = cloneDeep(elemData.animations || [])
    this.events = cloneDeep(elemData.events || [])
    this.propsValue = deepClone(elemData.propsValue || elemData.needProps || {})
    if (elemData.title) {
      this.title = elemData.title
    }
  }
}
